<template>
	<view class="page">
		<view class="numCar">
			<view class="title">
				算力
			</view>
			<view class="num">
				{{balance}}
			</view>
		</view>
		<view class="sel">
			<text>日期选择</text>
			<text class="icon"></text>
		</view>
		<view class="numList">
			<view class="box" v-for="(item, index) in tableData" :key="index">
				<view class="head">
					<view class="yuan"></view>
					<view class="state">{{ item.sceneText }}</view>
					<view class="FX1"></view>
					<view class="num" v-if="item.money > 0">+{{ item.money }}</view>
					<view class="num" v-else>{{ item.money }}</view>
				</view>
				<view class="date">
					{{ item.createTime }}
				</view>
			</view>
			<!-- 没有记录 -->
			<view class="d-c-c p30" v-if="tableData.length == 0 && !loading">
				<text class="iconfont icon-wushuju"></text>
				<text class="cont">亲，暂无相关记录哦</text>
			</view>
		</view>
	</view>

</template>

<script>
export default {
	data() {
		return {
			dataList: [],
			balance: '',
			balanceOpen: 1,
			cashOpen: 1,
			/*数据列表*/
			tableData: [],
			/*最后一页码数*/
			last_page: 0,
			/*当前页面*/
			page: 1,
			/*每页条数*/
			list_rows: 20,
			no_more: false,
			type: 'all',
			dateTime:''
		};
	},
	onShow() {
		/*获取数据*/
		this.getData();
		//获取余额记录列表
		this.getBalanceLogData();
	},
	methods: {
		/*获取数据*/
		getData() {
			let self = this;
			self.loading = true;
			self._get('balance/log/index', {}, function(res) {
				self.loading = false;
				// self.dataList = res.data.list;
				self.balance = res.data.balance;
				self.balanceOpen = res.data.balanceOpen;
				self.cashOpen = res.data.cashOpen;
			});
		},
		gotoList(type) {
			this.gotoPage('/pages/user/my-wallet/my-balance?type=' + type);
		},
		goback() {
			uni.navigateBack();
		},
		gotoPay() {
			this.gotoPage('/pages/order/recharge');
		},
		/*获取数据*/
		getBalanceLogData() {
			let self = this;
			let page = self.page;
			let list_rows = self.list_rows;
			self.loading = true;
			self._postBody(
				'balance/log/lists', {
					pageIndex: page || 1,
					pageSize: list_rows,
					type: self.type,
					dateTime:self.dateTime
				},
				function(res) {
					self.loading = false;
					self.tableData = self.tableData.concat(res.data.records);
					self.last_page = res.data.lastPage;
					if (res.data.lastPage <= 1) {
						self.no_more = true;
						return false;
					}
				}
			);
		}
	}
};
	
</script>

<style lang="scss" scoped>
	.page {
		padding: 0 20rpx;
	}

	.numCar {
		width: 710rpx;
		height: 280rpx;
		background-image: url('../../static/slbg.png');
		background-size: 100% 100%;

		.title {
			font-weight: 400;
			font-size: 30rpx;
			color: #FFFFFF;
			padding-top: 102rpx;
			padding-left: 52rpx;
		}

		.num {
			font-weight: bold;
			font-size: 72rpx;
			color: #FFFFFF;
			padding-left: 52rpx;
		}
	}

	.sel {
		text-align: center;
		// width: 180rpx;
		height: 45rpx;
		line-height: 45rpx;
		background: #F2F2F2;
		border-radius: 22rpx;
		font-size: 24rpx;
		color: #999999;
		margin-left: 530rpx;
		margin-top: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		.icon {
			width: 0;
			height: 0;
			border-left: 12rpx solid transparent;
			border-right: 12rpx solid transparent;
			border-top: 18rpx solid #999999;
			margin-left: 20rpx;
		}
	}
	.numList{
		margin-top: 37rpx;
		.box{
			border-top: 1rpx solid #CCCCCC;
			padding: 40rpx 24rpx 45rpx 14rpx;
			.head{
				display: flex;
				align-items: center;
				margin-bottom: 16rpx;
				.yuan{
					width: 10rpx;
					height: 10rpx;
					background: #0F4BCB;
					border-radius: 50%;
				}
				.state{
					font-weight: 400;
					font-size: 30rpx;
					color: #333333;
					line-height: 50rpx;
					margin-left: 20rpx;
				}
			}
			.date{
				font-weight: 300;
				font-size: 24rpx;
				color: #999999;
				margin-left: 30rpx;
			}
			
		}
	}
</style>